<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>login</title>
    <link rel="stylesheet" href="../plugins/elementui/index.css">
    <link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="../css/style.css">
    <link rel="stylesheet" href="../css/login.css">
</head>
<body>

<div id="loginApp" class="loginDiv" style="height: 350px">
    <form action="../pages/login.html" id="form" :model="loginData">
        <h1 id="loginMsg">用户登录</h1>
        <p>Username:<input id="username"
                           name="username"
                           v-model="loginData.username"
                           placeholder="请输入用户名"
                           type="text"></p>

        <p>Password :<input id="password"
                            name="password"
                            v-model="loginData.password"
                            show-password
                            placeholder="请输入密码"
                            type="password"></p>
        <div id="subDiv">
            <input type="reset" class="button" value="login up" @click="login()">
            <input type="reset" class="button" value="reset" @click="resetForm()">&nbsp;&nbsp;&nbsp;
            <a href="register.html">没有账号？</a>
        </div>
    </form>
</div>

</body>
<script src="../js/vue.js"></script>
<script src="../plugins/elementui/index.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script src="../js/axios.min.js"></script>
<script>
    var vue = new Vue({

        el: '#loginApp',
        data: {
            loginData: {},//表单数据
        },

        //钩子函数，VUE对象初始化完成后自动执行
        created() {
        },

        methods: {
            login() {
                axios.post("/user/login", this.loginData).then((res) => {
                    if (res.data.code == 10010) {
                        localStorage.setItem('userInfo',JSON.stringify(res.data.data));
                        window.location.href = '/userIndex.html';
                        this.$message.success(res.data.msg);
                    } else if (res.data.code == 10014) {
                        localStorage.setItem('userInfo',JSON.stringify(res.data.data));
                        window.location.href = '/adminIndex.html';
                        this.$message.success(res.data.msg);
                    }else if (res.data.code == 10011) {
                        this.$message.error(res.data.msg);
                        this.loginData = {};
                    } else if (res.data.code == 10012) {
                        this.$message.error(res.data.msg);
                        this.loginData = {};
                    } else if (res.data.code == 10013) {
                        this.$message.error(res.data.msg);
                        this.loginData = {};
                    } else {
                        this.$message.error(res.data.msg);
                    }
                }).finally(() => {
                });
            },
            //重置表单
            resetForm() {
                this.loginData = {};
            }
        }
    })

</script>
</html>